<template>
    <div style="flex:90;display: flex;">

        <!--今日趋势-->
        <div style="flex: 20;">
            <p class="label">趋势</p>
            
            <el-select
                v-model="value_qs_big_t"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_qs_big_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
            <el-select
                v-model="value_qs_small_t"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_qs_small_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
            <el-select 
                v-model="value_volume_t"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_volume_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
            <el-select
                v-model="value_pre_updown_t"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_pre_updown_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
            <el-select
                v-model="value_pre_high_t"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_pre_high_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
            <el-select
                v-model="value_pre_low_t"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_pre_low_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>

        </div>    

        <!--今日主力-->
        <div style="flex: 20;">
            <p class="label">今日主力</p>
            <el-select
                v-model="value_main_step"
                placeholder="Select"
                size="large"
                class="select"
                @change="handleChange_yt_t">
                <el-option
                    v-for="item in options_main_step_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>  
            <el-select
                v-model="value_main_step_small_t"
                placeholder="Select"
                size="large"
                class="select">
                <el-option
                    v-for="item in options_main_step_small_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>  
            <el-select 
                v-model="value_volume_main_t"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_volume_main_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
        </div>

        <!--今日散户-->
        <div style="flex: 20;">
            <p class="label">今日散户</p>
            <el-select
                v-model="value_san_sail"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_san_sail"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
            <el-select 
                v-model="value_volume_san_t"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_volume_san_t"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
        </div>    

        <!--散户-->
        <div style="flex: 20;">
            <p class="label">散户</p>
            <el-select
                v-model="value_san_sail"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_san_sail"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
            <el-select 
                v-model="value_volume_san"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_volume_san"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
        </div>

        <!--主力-->
        <div style="flex: 20;">
            <p class="label">主力</p>
            <el-select
                v-model="value_main_step"
                placeholder="Select"
                size="large"
                class="select"
                @change="handleChange_yt">
                <el-option
                    v-for="item in options_main_step"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>  
            <el-select
                v-model="value_main_step_small"
                placeholder="Select"
                size="large"
                class="select">
                <el-option
                    v-for="item in options_main_step_small"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>  
            <el-select 
                v-model="value_volume_main"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_volume_main"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>   
        </div>

        <!-- 涨跌判断 -->
        <div style="flex:20;float:left">
            <p class="label">涨跌判断</p>
            <el-select
                v-model="value_qs_big"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_qs_big"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
            <el-select
                v-model="value_qs_small"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_qs_small"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
            <el-select 
                v-model="value_volume"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_volume"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
            <el-select
                v-model="value_pre_updown"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_pre_updown"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>

            <el-select
                v-model="value_pre_high"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_pre_high"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>

            <el-select
                v-model="value_pre_low"
                placeholder="Select"
                size="large"
                class="select"
                >
                <el-option
                    v-for="item in options_pre_low"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
            </el-select>
        </div>

        <!-- 分时图 -->
        <div style="flex:20;">
          
        </div>
        
    </div>
</template>

<script>

export default {
    data() {
        return {

            value_qs_big_t: '大趋势',
            options_qs_big_t : [
                { value: '狂跌'},
                { value: '阴跌'},
                { value: '小跌'},
                { value: '震荡向上'},
                { value: '震荡向下'},
                { value: '小涨'},
                { value: '大涨'},
                { value: '狂涨'},
            ],
            value_qs_small_t: '小趋势',
            options_qs_small_t : [
                { value: '狂跌'},
                { value: '阴跌'},
                { value: '小跌'},
                { value: '震荡向上'},
                { value: '震荡向下'},
                { value: '小涨'},
                { value: '大涨'},
                { value: '狂涨'},
            ],   
            value_qs_big: '大趋势',
            options_qs_big : [
                { value: '狂跌'},
                { value: '阴跌'},
                { value: '小跌'},
                { value: '震荡向上'},
                { value: '震荡向下'},
                { value: '小涨'},
                { value: '大涨'},
                { value: '狂涨'},
            ],
            value_qs_small: '小趋势',
            options_qs_small : [
                { value: '狂跌'},
                { value: '阴跌'},
                { value: '小跌'},
                { value: '震荡向上'},
                { value: '震荡向下'},
                { value: '小涨'},
                { value: '大涨'},
                { value: '狂涨'},
            ], 
            
            value_main_step: '阶段',
            options_main_step : [ 
                { value: '0',label: '弃仓阶段'},             
                { value: '1',label: '建仓阶段'},
                { value: '2',label: '试盘阶段'},
                { value: '3',label: '拉升阶段'},
                { value: '4',label: '出货阶段'},
                { value: '5',label: '等待阶段'},
            ],
            value_main_step_t: '阶段',
            options_main_step_t : [ 
                { value: '0',label: '弃仓阶段'},             
                { value: '1',label: '建仓阶段'},
                { value: '2',label: '试盘阶段'},
                { value: '3',label: '拉升阶段'},
                { value: '4',label: '出货阶段'},
                { value: '5',label: '等待阶段'},
            ],
            options_main_step_small_all : [[              
                { value: 'a0'},
                { value: 'a1'},
                { value: 'a2'},
                { value: 'a3'},
                { value: 'a4'},
                { value: 'a5'},
            ],
            [              
                { value: 'b0'},
                { value: 'b1'},
                { value: 'b2'},
                { value: 'b3'},
                { value: 'b4'},
                { value: 'b5'},
            ],
            [              
                { value: 'c0'},
                { value: 'c1'},
            ],
            [              
                { value: 'd0'},
                { value: 'd1'},
            ],
            [              
                { value: 'e0'},
                { value: 'e1'},
            ],
            [              
                { value: 'f0'},
                { value: 'f1'},
            ]],

            value_main_step_small: '手法',
            options_main_step_small:[],
            value_main_step_small_t: '手法',
            options_main_step_small_t:[],
            
            value_main_sail: '主力',
            options_main_sail : [
                { value: '卖-突发利空消息'},
                { value: '卖-割肉狂跌'},
                { value: '卖-撤退阴跌'},
                { value: '卖-闷棍砸盘'},
                { value: '卖-洗盘'},
                { value: '卖-维稳'},
                { value: '买-护盘'},
                { value: '买-抄底'},
                { value: '买-小阳线'},
                { value: '买-拉升'},
                { value: '买-突发利好消息'},
                { value: '买-打广告'},
                { value: '买-主升浪'},
            ],
            value_san_sail: '散户',
            options_san_sail : [
                { value: '卖-突发利空消息'},
                { value: '卖-割肉跑路'},
                { value: '卖-投机分子撤退'},
                { value: '卖-小跌恐慌跑路'},
                { value: '卖-宁死不从回血跑路'},
                { value: '卖-不涨不跌跑路'},   
                { value: '无操作-没有散户'},
                { value: '买-抄底'},
                { value: '买-跟风追高'},
                { value: '买-热门股票'},   
                { value: '买-突发利好消息'},
            ],

            value_volume_t: '量',
            options_volume_t : [
                { value: '放量+'},
                { value: '平量0'},
                { value: '缩量-'},
            ],    
            value_pre_updown_t: '涨跌',
            options_pre_updown_t: [
                { value: '涨0%-2%'},
                { value: '涨2%-4%'},
                { value: '涨4%-6%'},
                { value: '涨6%-8%'},
                { value: '涨8%-10%'},
                { value: '跌(0)% ~ (-2)%'},
                { value: '跌(-2)% ~ (-4)%'},
                { value: '跌(-4)% ~ (-6)%'},
                { value: '跌(-6)% ~ (-8)%'},
                { value: '跌(-8)% ~ (-10)%'},
            ],
            value_pre_high_t: '最高价',
            options_pre_high_t: [
                { value: '最高价0%-2%'},
                { value: '最高价2%-4%'},
                { value: '最高价4%-6%'},
                { value: '最高价6%-8%'},
                { value: '最高价8%-10%'},
            ],
            value_pre_low_t: '最低价',
            options_pre_low_t : [
                { value: '最低价(0)% ~ (-2)%'},
                { value: '最低价(-2)% ~ (-4)%'},
                { value: '最低价(-4)% ~ (-6)%'},
                { value: '最低价(-6)% ~ (-8)%'},
                { value: '最低价(-8)% ~ (-10)%'},
            ],

            value_volume: '量',
            options_volume : [
                { value: '放大量+'},
                { value: '放量+'},
                { value: '平量0'},
                { value: '缩量-'},
                { value: '缩大量-'},
            ],   
            value_volume_main: '量',
            options_volume_main : [
                { value: '放大量+'},
                { value: '放量+'},
                { value: '平量0'},
                { value: '缩量-'},
                { value: '缩大量-'},
            ],  
            value_volume_main_t: '量',
            options_volume_main_t : [
                { value: '放大量+'},
                { value: '放量+'},
                { value: '平量0'},
                { value: '缩量-'},
                { value: '缩大量-'},
            ],
            value_volume_san: '量',
            options_volume_san : [
                { value: '放大量+'},
                { value: '放量+'},
                { value: '平量0'},
                { value: '缩量-'},
                { value: '缩大量-'},
            ], 
            value_volume_san_t: '量',
            options_volume_san_t : [
                { value: '放大量+'},
                { value: '放量+'},
                { value: '平量0'},
                { value: '缩量-'},
                { value: '缩大量-'},
            ],   
            value_pre_updown: '涨跌',
            options_pre_updown : [
                { value: '涨0%-2%'},
                { value: '涨2%-4%'},
                { value: '涨4%-6%'},
                { value: '涨6%-8%'},
                { value: '涨8%-10%'},
                { value: '跌(0)% ~ (-2)%'},
                { value: '跌(-2)% ~ (-4)%'},
                { value: '跌(-4)% ~ (-6)%'},
                { value: '跌(-6)% ~ (-8)%'},
                { value: '跌(-8)% ~ (-10)%'},
            ],
            value_pre_high: '最高价',
            options_pre_high : [
                { value: '最高价0%-2%'},
                { value: '最高价2%-4%'},
                { value: '最高价4%-6%'},
                { value: '最高价6%-8%'},
                { value: '最高价8%-10%'},
            ],
            value_pre_low: '最低价',
            options_pre_low : [
                { value: '最低价(0)% ~ (-2)%'},
                { value: '最低价(-2)% ~ (-4)%'},
                { value: '最低价(-4)% ~ (-6)%'},
                { value: '最低价(-6)% ~ (-8)%'},
                { value: '最低价(-8)% ~ (-10)%'},
            ],
        }
    },
    methods: {
        handleChange_yt(value) {
            console.log(value);
            this.options_main_step_small = this.options_main_step_small_all[value];
        },
        handleChange_yt_t(value) {
            console.log(value);
            this.options_main_step_small_t = this.options_main_step_small_all[value];
        }
    },
   
}
</script>

<style scoped>
.select{
    margin-top: 20px;
    margin-left:10%;
    margin-right: 10%;
    width:80%;
  }
  .label{
    margin-top: 20px;
    margin-left:10%;
    font-size: 18px;
    font-weight: bold;
  }
  .inputArea {
    margin-top: 20px;
    margin-left:10%;
    width:80%;
  }
</style>
